<!-- components/ContentSkeleton.vue -->
<template>
  <div class="h-[calc(100vh-104px)] pt-4 pl-1 pr-1 flex flex-col md:flex-row gap-5 animate-pulse">
    <!-- 项目介绍骨架 -->
    <div class="w-full md:w-1/2 h-full bg-white dark:bg-neutral-800 rounded shadow text-sm flex flex-col">
      <div class="text-center py-3 border-b border-gray-200 dark:border-neutral-600 font-bold text-lg">
        <div class="h-6 bg-gray-300 dark:bg-gray-700 rounded w-1/2 mx-auto"></div>
      </div>
      <div class="flex-1 overflow-y-auto p-4 space-y-3">
        <div v-for="i in 8" :key="i" class="h-4 bg-gray-300 dark:bg-gray-700 rounded w-full"></div>
      </div>
    </div>

    <!-- 个人简历骨架 -->
    <div class="w-full md:w-1/2 h-full bg-white dark:bg-neutral-800 rounded shadow text-sm flex flex-col">
      <div class="text-center py-3 border-b border-gray-200 dark:border-neutral-600 font-bold text-lg">
        <div class="h-6 bg-gray-300 dark:bg-gray-700 rounded w-1/2 mx-auto"></div>
      </div>
      <div class="flex-1 overflow-y-auto p-4 space-y-3">
        <div v-for="i in 8" :key="i" class="h-4 bg-gray-300 dark:bg-gray-700 rounded w-full"></div>
      </div>
    </div>
  </div>
</template>
